﻿<div id="gridRoles"></div>
<div id="dlgAddRole" style="display:none;padding-left:10px;">
    <form id="formAddRole"></form>
</div>
<div id="dlgUpdateRole" style="display:none;padding-left:10px;">
    <form id="formUpdateRole"></form>
</div>

<script type="text/javascript">
    var gridRoles = null;
    var dlgAddRole = null;
    var dlgUpdateRole = null;
    var formAddRole = null;
    var formUpdateRole = null;

    function addRole() {
        $.post('/API/Role/Create', formAddRole.getData(), function (data) {
            if (data.code == 0) {
                $.ligerDialog.success('添加成功', '提示');
                loadRoles();
                dlgAddRole.hide();
            } else {
                $.ligerDialog.error(data.msg, '错误');
            }
        }, 'json');
    }

    function updateRole() {
        $.post('/API/Role/Update', formUpdateRole.getData(), function (data) {
            if (data.code == 0) {
                $.ligerDialog.success('修改成功', '提示');
                loadRoles();
                dlgUpdateRole.hide();
            } else {
                $.ligerDialog.error(data.msg, '错误');
            }
        }, 'json');
    }
    
    function deleteRole(row) {
        $.post('/API/Role/Delete', row,
            function (data) {
                if (data.code == 0) {
                    $.ligerDialog.success('删除成功', '提示');
                    loadRoles();
                } else {
                    $.ligerDialog.error(data.msg, '错误');
                }
            }, 'json');
    }

    function showDlgAddRole() {
        if (dlgAddRole) {
            dlgAddRole.show();
        }
        else {
            dlgAddRole = $.ligerDialog.open({
                target: $('#dlgAddRole'),
                width: 320,
                height: 120,
                title: '添加新角色',
                isResize: true,
                modal: true,
                buttons: [
                    {
                        text: '确定', onclick: function () {
                            if (formAddRole.valid()) {
                                addRole();
                            }
                            else {
                                formAddRole.showInvalid();
                            }
                        }
                    },
                    {
                        text: '取消', onclick: function () {
                            dlgAddRole.hide();
                        }
                    }
                ]
            });
        }
    }

    function showDlgUpdateRole(row) {
        if (dlgUpdateRole) {
            dlgUpdateRole.show();
        }
        else {
            dlgUpdateRole = $.ligerDialog.open({
                target: $('#dlgUpdateRole'),
                width: 320,
                height: 120,
                title: '修改角色',
                isResize: true,
                modal: true,
                buttons: [
                    {
                        text: '确定', onclick: function () {
                            if (formUpdateRole.valid()) {
                                updateRole();
                            }
                            else {
                                formUpdateRole.showInvalid();
                            }
                        }
                    },
                    {
                        text: '取消', onclick: function () {
                            dlgUpdateRole.hide();
                        }
                    }
                ]
            });
        }

        formUpdateRole.setData(row);
    }

    function itemclick(item) {
        switch (item.method)
        {
            case 'add':
                showDlgAddRole();
                break;

            case 'update':
                DoAction(gridRoles, function (row) {
                    showDlgUpdateRole(row);
                }, '请选择需要修改的角色');
                break;

            case 'delete':
                DoActionConfirm(gridRoles, deleteRole, '请选择需要修删除的角色', '是否要删除当前选择的角色？');
                break;
        }
    }

    var toolbarRoles = {
        items: [
            { method: 'add', text: '增加', click: itemclick, icon: 'add' },
            { line: true },
            { method: 'update', text: '修改', click: itemclick, icon: 'modify' },
            { line: true },
            { method: 'delete', text: '删除', click: itemclick, icon: 'delete' },
            { line: true },
            { method: 'permission', text: '分配角色权限', click: itemclick, icon: 'modify' },
            { line: true },
            { method: 'roleUser', text: '分配角色用户', click: itemclick, icon: 'role' }
        ]
    };

    var columnRoles = [
        { display: '', name: 'Id', align: 'left', hide: true },
        { display: '角色名', name: 'RoleName', align: 'left', width: 200, minwidth: 120 }
    ];

    function loadRoles() {
        var complete = false;
        $.post('/API/Role/Query', {}, function (data) {
            complete = true;
            gridRoles.loadData(data);
            gridRoles.gridloading.hide(100);
        }, 'json');
                
        var n = setInterval(function () {
            clearInterval(n);
            if (!complete) {                
                gridRoles.gridloading.show();
            }
        }, 100);        
    }

    function initForm() {
        formAddRole = $('#formAddRole').ligerForm({
            inputWidth: 170, labelWidth: 90, space: 40,
            fields: [
                { display: '角色名称', name: 'RoleName', newline: true, type: 'text', validate: { required: true } }
            ],
            validate: {}
        });

        formUpdateRole = $('#formUpdateRole').ligerForm({
            inputWidth: 170, labelWidth: 90, space: 40,
            fields: [
                { name: 'Id', type: 'hidden' },
                { display: '角色名称', name: 'RoleName', newline: true, type: 'text', validate: { required: true } }
            ],
            validate: {}
        });
    }

    $(document).ready(function () {
        $.metadata.setType("attr", "validate");
        initForm();
        gridRoles = $('#gridRoles').ligerGrid({
            title: '角色信息',
            columns: columnRoles,
            toolbar: toolbarRoles,
            resizable: false,
            frozen: false,
            rownumbers: true,
            dataAction: 'local'
        });

        loadRoles();
    });
</script>